/* hamburger Menu */

.hamburger {
    cursor: pointer;
    width: 24px;
    height: 24px;
    transition: all 0.25s;
    position: relative;
}

.hamburger-top,
.hamburger-middle,
.hamburger-bottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 2px;
    background-color: #000;
    transform: rotate(0);
    transition: all 0.5s;
}

.hamburger-top {
    transform: translateY(7px);
}

.hamburger-bottom {
    transform: translateY(14px);
}

.open {
    transform: rotate(90deg);
    transform: translateY(0px);
}

.open .hamburger-top {
    transform: rotate(45deg) translateY(6px) translate(6px);
}

.open .hamburger-middle {
    display: none;
}

.open .hamburger-bottom {
    transform: rotate(-45deg) translateY(6px) translate(-6px);
}

.icon-hover:hover svg {
    fill: #fff;
}

.icon-hover:disabled:hover svg,
.icon-hover:disabled svg {
    fill: #c5c5c5;
}

.hero-img {
    height: 412px;
    width: 630px;
    background: #c4c4c4;
}

.animateIn {
    animation: animateIn 1s ease 0s 1 normal forwards;
}

.animateOut {
    animation: animateOut 1s ease 0s 1 normal forwards;
}

.rotate-up {
    animation: rotateUp 300ms ease 0s 1 normal forwards;
}

.rotate-down {
    animation: rotateDown 300ms ease 0s 1 normal forwards;
}

.slide {
    position: relative;
    min-width: 100%;
    padding-left: 10px;
}

.slide__inner {
    position: relative;
    overflow: hidden;
}

.slide__img {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    width: auto;
    min-height: 100%;
    min-width: 100%;
    max-width: none;
    transform: translate(-50%, -50%);
}

.embla__viewport.is-draggable {
    cursor: move;
    cursor: grab;
}

.embla__viewport.is-dragging {
    cursor: grabbing;
}

.embla__button {
    outline: 0;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.5);
    touch-action: manipulation;
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    fill: #fff;
    width: 30px;
    height: 30px;
    padding: 8px;
}

.embla__button:disabled {
    cursor: default;
    display: none;
}

.embla__button__svg {
    width: 100%;
    height: 100%;
}

.embla__button--prev {
    left: 27px;
}

.embla__button--next {
    right: 27px;
}

.video {
    aspect-ratio: 16 / 9;
    width: 100%;
}

.link:hover img {
    transform: scale(1.25);
}

.grid-flow-row {
    grid-auto-flow: row;
}

.hover-up {
    top: 45%;
    bottom: 0;
    transition: all 0.3s ease-in-out;
}

    .offer:hover .hover-up {
        top: -25%;
    }

.dot {
    width: 8px;
    height: 6px;
    margin-right: 6px;
    background-color: rgba(45, 50, 144, 0.5);
    border-radius: 3px;
    cursor: pointer;
    transition: 0.3s ease width;
}

.dot.dot-white {
    background-color: rgba(255, 255, 255, 0.5);
}

.dot.dot-white.active {
    background-color: #fff;
}

.dot:last-child {
    margin-right: 0;
}

.dot.active {
    width: 31px;
    cursor: auto;
    background-color: #2d3290;
}

.testimonial-slide {
    flex: 0 0 100%;
}

.img-slide {
    flex: 0 0 100%;
}

.breadcrumb {
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/header.jpeg") no-repeat center fixed;
    background-size: cover;
}

.breadcrumb h2::after {
    left: calc(50% - (7rem / 2));
}

.contact-bg {
    background: linear-gradient(rgba(249, 249, 249, 1), rgba(249, 249, 249, 0)), url("../images/frontend/backgrounds/bottom-left.png") no-repeat left bottom, url("../images/frontend/backgrounds/bottom-right.png") no-repeat right bottom;
}

.animate-full {
    animation: animateFull 1s ease 0s 1 normal forwards;
}

.animate-0 {
    animation: animateFull 1s ease 0s 1 reverse forwards;
}

.triangle {
    clip-path: polygon(100% 0, 0 0, 50% 99%);
}

.bg-contact {
    background: url("../images/frontend/backgrounds/top-right.svg") no-repeat top right, url("../images/frontend/backgrounds/left-bottom.png") no-repeat bottom left, url("../images/frontend/backgrounds/center-circle.svg") no-repeat center center, url("../images/frontend/backgrounds/circle-primary.svg") no-repeat 10% 10%, url("../images/frontend/backgrounds/center-circle.svg") no-repeat 5% 5%, linear-gradient(rgba(45, 50, 144, 1), rgba(45, 50, 144, 1));
}

select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-image: url("../images/frontend/icons/angle-down.svg");
    background-repeat: no-repeat;
    background-position: calc(100% - 3px) center;
    background-size: 1rem auto;
}

/*[type="date"] {*/

/*}*/

[type="date"]::-webkit-inner-spin-button {
    display: none;
}
[type="date"]::-webkit-calendar-picker-indicator {
    background: url("../images/frontend/icons/angle-down.svg") 95% 50% no-repeat;
    background-size: 1rem auto;
}

[type="date"].no-picker::-webkit-calendar-picker-indicator {
    background: none;
}

.gallery {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: .5rem;
}


@media screen and (min-width: 768px) {
    .gallery {
        grid-template-columns: repeat(2, 1fr);
    }

    .gallery div:nth-child(2) {
        grid-column: 2;
        grid-row: 2 / 4;
    }

    .gallery div:nth-child(5) {
        grid-column: 1 / 3;
        grid-row: 1 / 2;
    }
}

@media screen and (min-width: 768px) {
    .slide {
        min-width: 50%;
    }
    .testimonial-slide {
        flex: 0 0 50%;
    }
}

@media screen and (min-width: 992px) {
    
    .testimonial-slide {
        flex: 0 0 33.333%;
    }
}

@keyframes animateFull {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}

@keyframes animateIn {
    0% {
        transform: scale3d(0, 0, 0);
    }
    30% {
        transform: scale3d(0.95, 0.05, 1);
    }
    40% {
        transform: scale3d(0.75, 1.25, 1);
    }
    75% {
        transform: scale3d(1.25, 0.75, 1);
    }
    100% {
        transform: scale3d(1, 1, 1);
    }
}

@keyframes animateOut {
    0% {
        transform: scale3d(1, 1, 1);
    }
    30% {
        transform: scale3d(1.25, 0.75, 1);
    }
    40% {
        transform: scale3d(0.75, 1.25, 1);
    }
    75% {
        transform: scale3d(0.95, 0.05, 1);
    }
    100% {
        transform: scale3d(0, 0, 0);
    }
}

@keyframes rotateUp {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(180deg);
    }
}

@keyframes rotateDown {
    0% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(0deg);
    }
}